/**
 * Charts7
 */
import React from 'react'
import style from './index.less'
import moment from 'moment'
import {IECharts} from '../../../../components'

const Charts7 = ({
  data = [
    {
      name: '指数1',
      value: 12
    }, {
      name: '指数2',
      value: 41.4
    }, {
      name: '指数3',
      value: 10
    }, {
      name: '指数4',
      value: 4.4
    }
  ],
  color=['#2EC7C9', '#B6A2DE', '#5AB1EF', '#FFB980','#D87A80','#8D98B3'],
  height=300
}) => {
  const myProps = {
    option: {
      tooltip: {
          trigger: 'item'
      },
      calculable: true,
      grid: {
          borderWidth: 0,
          left: '3%',
	        right: '4%',
	        bottom: '5%',
					top:'10%',
	        containLabel: true
      },
      xAxis: [
          {
              type: 'category',
              show: false,
              data: data.map(item=>item.name)
          }
      ],
      yAxis: [
          {
              type: 'value',
              show: false
          }
      ],
      series: [
          {
              name: '',
              type: 'bar',
              itemStyle: {
                  normal: {
                      color: function(params) {
                          return color[params.dataIndex]
                      },
                      label: {
                          show: true,
                          position: 'top',
                          formatter: '{b}\n{c}分'
                      }
                  }
              },
              data: data.map(item=>item.value)
          }
      ]
  }

	}
	return (
	  <div className={`chart ${style.chart}`} style={{
		  height
		}}>
		  <IECharts {...myProps} resizable={true}/>
		</div>
	)
	}

Charts7.propTypes = {
// data
}

export default Charts7
